<template>
    <el-dialog :visible.sync="visible" title="合同详情" :close-on-click-modal="false"
               :close-on-press-escape="false" append-to-body>
        <template v-for="(data, key) in contractParam">
            <template v-if="typeof data === 'string'">
                <el-row>
                    <el-col :span="4"><div>{{key}}：</div></el-col>
                    <el-col :span="16"><div>{{data}}</div></el-col>
                </el-row>
            </template>
            <template v-else>
                <el-collapse>
                    <el-collapse-item :title="key">
                        <template v-for="(data1, key1) in data">
                            <el-row v-if="key1 !== '盖章'">
                                <el-col :span="4"><div>{{key1}}：</div></el-col>
                                <el-col :span="16"><div>{{data1}}</div></el-col>
                            </el-row>
                        </template>
                    </el-collapse-item>
                </el-collapse>
            </template>
        </template>
        <template slot="footer">
            <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
        </template>
    </el-dialog>
</template>

<script>
import Template from './template'
export default {
  name: 'contract-detail',
  components: { Template },
  data () {
    return {
      visible: false,
      contractParam: null
    }
  },
  props: {
    contractDetailData: {
      type: Object
    }
  },
  methods: {
    init: function () {
      this.visible = true
      this.contractParam = JSON.parse(this.contractDetailData.contractParam)
      console.log(this.contractParam)
    }
  }
}
</script>

<style scoped>

</style>
